<%--
  Created by IntelliJ IDEA.
  User: sunhao
  Date: 2015/9/29 0029
  Time: 上午 11:10
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE HTML>

<html>
<head>
  <title>支出设置</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <%--<link href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" type="text/css">--%>
  <link href="/static/bui/css/bs3/dpl.css" rel="stylesheet" type="text/css"/>
  <link href="/static/bui/css/bs3/bui.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<div class="row" style="margin-top: 50px">
  <div class="span21 offset3 control-row-auto">
    <div id="grid"></div>
    <input type="hidden" name="lesson">
  </div>
</div>

<div id="content" class="hide">
  <form id="J_Form" class="form-horizontal bui-form-horizontal bui-form bui-form-field-container">
    <div class="row" style="display: none">
      <div class="control-group span8">
        <label class="control-label"><s>*</s>id：</label>

        <div class="controls">
          <input name="_id" type="text" id="_id" class="input-normal control-text bui-form-field"
                 aria-disabled="false" aria-pressed="false">
        </div>
      </div>
    </div>
    <div class="row">
      <div class="control-group span8">
        <label class="control-label"><s>*</s>支出项目：</label>

        <div class="controls">
          <input id="name" name="name" type="text" data-rules="{required:true}"
                 class="input-normal control-text bui-form-field" aria-disabled="false"
                 aria-pressed="false">
        </div>
      </div>
    </div>
    <div class="row">
      <div class="control-group span8">
        <label class="control-label"><s>*</s>会计项目：</label>

        <div class="controls">
          <input  name="item" type="text" data-rules="{required:true}"
                  class="input-normal control-text bui-form-field" aria-disabled="false"
                  aria-pressed="false">
        </div>
      </div>
    </div>
  </form>
</div>
<script type="text/javascript" src="/static/bui/js/jquery-1.8.1.min.js"></script>
<script type="text/javascript" src="/static/bui/js/bui.js"></script>
<script type="text/javascript" src="/static/bui/js/config.js"></script>
<script type="text/javascript">
  BUI.use('common/page');
  <%--</script>--%>
  <%--<script type="text/javascript">--%>
  BUI.use(['bui/grid', 'bui/data', 'bui/form'], function (Grid, Data, Form) {
    var columns = [
//              {title: 'ID', dataIndex: '_id', width: '40%'},
              {title: '支出项目', dataIndex: 'name', width: '20%'},
              {title: '会计项目', dataIndex: 'item', width: '20%'},
              {
                title: '操作', width: '30%', renderer: function () {
                var editStr = '<span class="grid-command btn-edit"><i class="icon-edit"></i>编辑</span>'
                return editStr
              }
              }
            ],
    //默认的数据
            data = [
              <c:forEach items="${expends}" var="r">
              {
                _id: '${r._id}',
                name: '${r.name}',
                item:'${r.item}'

              },
              </c:forEach>
            ],
            store = new Data.Store({
              data: data,
              pageSize: 20
            }),
            editing = new Grid.Plugins.DialogEditing({
              contentId: 'content',
              triggerCls: 'btn-edit',
              editor: {
                focusable: false,
                success: function () {
                  var editType = editing.get('editType'),
                          edtor = this,
                          form = edtor.get("form");
                  form.valid();
                  if (form.isValid()) {
                    this.close();
                    if (editType == 'add') {
                      $.ajax({
                        type: 'post',
                        url: '/manage/addExpend',
                        data: $("#J_Form").serialize(),
                        success: function (msg) {
                          if (msg == 'success') {
                            msg = "添加成功！";
                            BUI.Message.Alert(msg, function () {
                              window.location.href = '/manage/expend.do';
                            }, 'success')
                          } else {
                            msg = "添加失败";
                            BUI.Message.Alert(msg, function () {
                              window.location.href = '/jsp/error/noAuthority.jsp';
                            }, 'error')
                          }

                        }
                      })
                    } else {
                      $.ajax({
                        type: 'post',
                        url: '/manage/updateExpend',
                        data: $("#J_Form").serialize(),
                        success: function (msg) {
                          if (msg == 'success') {
                            msg = '修改成功！';
                            BUI.Message.Alert(msg, function () {
                              window.location.href = '/manage/expend.do';
                            }, 'success')
                          } else {
                            msg = '修改失败';
                            BUI.Message.Alert(msg, function () {
                              window.location.href = '/jsp/error/noAuthority.jsp';
                            }, 'error')
                          }
                        }
                      })
                    }
                  }
                }
              }
            }),
            grid = new Grid.Grid({
              render: '#grid',
              columns: columns,
              width: '100%',
//                    forceFit: true,
              plugins: [Grid.Plugins.AutoFit],
              store: store,
              bbar: {
                pagingBar: true,
                elCls: 'image-pbar'
              },
              plugins: [Grid.Plugins.CheckSelection, editing],
              tbar: {
                items: [{
                  btnCls: 'button button-small',
                  text: '<i class="icon-plus"></i>添加',
                  listeners: {
                    'click': addFunction
                  }
                },
                  {
                    btnCls: 'button button-small',
                    text: '<i class="icon-remove"></i>删除',
                    listeners: {
                      'click': delFunction
                    }
                  }]
              }
            });
    grid.render();


    function addFunction() {
      var newData = {};
      editing.add(newData); //添加记录后，直接编辑
    }

    function delFunction() {
      var selections = grid.getSelection();
      delItems(selections);
    }

    function delItems(items) {
      var _ids = [];
      BUI.each(items, function (item) {
        _ids.push(item._id)
      });
      if (_ids.length) {
        BUI.Message.Confirm('确认要删除吗？', function () {
          $.ajax({
            type: 'POST',
            url: '/manage/delExpend?_ids=' + _ids,
            success: function (msg) {
              if (msg == 'success') {
                msg = "删除成功！";
                BUI.Message.Alert(msg, function () {
                  window.location.href = '/manage/expend.do';
                }, 'success')
              } else {
                msg = '删除失败'
                BUI.Message.Alert(msg, function () {
                  window.location.href = '/jsp/error/noAuthority.jsp';
                }, 'error')
              }
            }
          })
        })
      }
    };
    var form = new Form.HForm({
      srcNode: '#J_Form'
    });
  });
</script>
</div>
</body>
</html>
